import {createSlice,createAsyncThunk} from '@reduxjs/toolkit'
import axios from 'axios'
interface stateType{
    layding:boolean,
    list:listType[]
}
export interface listType{
    url:string,
    name:string,
    title:string,
    id:string,
    isFinite:boolean,
    children:childrenType[]
}
interface childrenType{
    url:string,
    name:string,
    title:string,
    id:string,
}
// 18.所有数据均用状态管理存储12:12
const initialState:stateType={
    layding:false,
    list:[]
}
// 19.所需异步操作，使用thunk处理12:12
export const functiongetAxiosList=createAsyncThunk('functiongetAxiosList',async()=>{
    const resp=await axios.get('/api/list')
    return resp.data.list
})
export const functionAddAxiosList=createAsyncThunk('functionAddAxiosList',async(tate:listType,ThunkAction)=>{
    const resp=await axios.get('/api/add',{params:{title:tate.title,url:tate.url,name:tate.name,isFinite:tate.isFinite,id:tate.id,children:tate.children}})
    ThunkAction.dispatch(functiongetAxiosList())
    return resp.data.list
})
export const functionGetId=createAsyncThunk('functionGetId',async(id:string,ThunkAction)=>{
    const resp=await axios.get('/api/shan',{params:{id:id}})
    ThunkAction.dispatch(functiongetAxiosList())
    return resp.data.list
})
const storeState=createSlice({
    name:'storeState',
    initialState,
    reducers:{},
    extraReducers:{
        [functiongetAxiosList.pending.type]:(state)=>{
            state.layding=true
        },
        [functiongetAxiosList.fulfilled.type]:(state,action)=>{
            state.layding=false
            state.list=action.payload
        },
        [functiongetAxiosList.rejected.type]:(state)=>{
            state.layding=false
        }
    }
})
export default storeState